<template>
    <div class="record">
        <van-nav-bar :title="$t('ecology.dhrocord')" leftArrow @click-left="_return" />
        <div class="recordMain">
            <ul>
                <li v-if="list.length>0"  v-for="item in list">
                    <van-row class="top" type="flex" justify="space-between">
                        <van-col>
                            <p>{{$t('ecology.dhrocord')}} {{item.level}} USDT</p>
                            <span>{{item.add_time}}</span>
                        </van-col>
                        <van-col>
                            <p>{{item.status}}</p>
                            <span>{{$t('node.totals')}} {{Number(item.total).toFixed(2)}} USDT</span>
                        </van-col>
                    </van-row>
                    <van-row class="bottom" type="flex" justify="space-between">
                        <van-col>
                            <p>支付：</p>
                            <p v-for="(tab,index) in $t('node.tab')" v-if="index!=4">{{tab}}：</p>
                        </van-col>
                        <van-col>
                            <p><span>{{Number(item.uval).toFixed(2)}}</span>{{item.main_coin_name.toUpperCase()}} + <span>{{Number(item.ucoin_num).toFixed(2)}}</span>{{item.ucoin_name.toUpperCase()}}</p>
                            <p><span>{{Number(item.jingtai).toFixed(2)}}</span>USDT</p>
                            <p><span>{{Number(item.lianjie).toFixed(2)}}</span>USDT</p>
                            <p><span>{{Number(item.yeji).toFixed(2)}}</span>USDT</p>
                        </van-col>
                    </van-row>
                </li>
                <li style="color:#333;text-align: center" v-if="list.length===0">{{$t('ecology.nomore')}}</li>
            </ul>
        </div>
    </div>
</template>

<script>
    import moment from 'moment'
    export default {
        data() {
            return {
                list:[]
            }
        },
        methods: {
            _return(){
                this.$emit('_return')
            },
            getData(){
                this.$api.post('node/nodeList')
                    .then(res =>{

                        this.list = res.detail
                        this.list.map(item => {
                            item.add_time = moment(item.add_time*1000).format('YYYY.MM.DD')
                            switch (item.status) {
                                case 1:
                                    item.status = this.$t('node.sting')
                                    break;
                                case 2:
                                    item.status = this.$t('node.stings')
                                    break
                            }
                        })
                    })
            }
        },
        created() {
            this.getData()
        },
        mounted() {

        },
    }
</script>

<style lang="stylus" scoped>
    [class*=van-hairline]::after{
        border: none;
    }
    .recordMain
        width 94%
        margin 0 auto
        li
            padding 10px
            margin-bottom 10px
            color #333
            .top
                margin-top 10px
                padding-bottom 15px
                border-bottom 1px solid #404040
                .van-col
                    p
                        color #D8D8D8
                        font-size 16px
                    span
                        color #898989
                        font-size 12px
                    &:last-child
                        text-align right
                        p
                            color #CBAF89




            .bottom
                margin-top 10px
                padding-bottom 8px
                .van-col
                    p
                        color #898989
                        height 20px
                        line-height 20px
                        span
                            color #CBAF89
                    &:last-child
                        text-align right
</style>
